<template>
  <view class="container">
	<!-- 轮播图 -->
	<yd-banner :banner-list="bannerList"></yd-banner>
    <!-- 分类内容 -->
    <view class="productList">
		<view class="fw">咨询推荐</view>
		<view class="product" v-for="item in productList" :key="item.id" @click="toDeatil(item.id)">
			<view class="product-top disp aic">
				<view class="disp aic">
					<image class="product-Pic" :src="item.productImg" mode=""></image>
					<view class="">{{item.productName}}</view>
				</view>
				<view class="right disp">
					<view class="product-tabs fz10">{{item.productLable}}</view>
				</view>
			</view>
			<view class="product-mess disb aic">
				<view class="">
<!--					<view class="fz18 color fw">{{item.maxAmount}}</view>-->
          <view class="fz18 color fw">
          <u--text mode="price" :text="item.maxAmount" size="17" color="#D34200" bold="true"></u--text>
          </view>
					<view class="color6">{{ maxAmountLabel }}</view>
				</view>
				<view class="">
					<view class="fz18 fw">{{item.annualInterest}}</view>
					<view class="color6">{{ annualInterestLabel }}</view>
				</view>
				<view class="applyBtn tac colorf fz12" >立即咨询</view>
			</view>
		</view>
		<view class="mateBtn fz12 colorf tac" @click="toComple">智能匹配</view>
    </view>
	<tabbar :current="2" :tabBarList="tabBerLists"></tabbar>
  </view>
</template>

<script>
	import tabbar from "../../components/tabbar/tabbar.vue"
  import { getShop, } from '../../api/category';
  import {getBanner, getFontByKey} from "../../api/index.js"
  import { handleTree, convertTree } from '../../utils/tree.js';
  import {getUserInfo} from "../../api/setting";
  export default {
	  components:{
		  tabbar,
	  },
    data() {
      return {
        tabBerLists:[],
        bannerList: [],
        productList:[],
        userInfo:[],
        maxAmountLabel: '',
        annualInterestLabel: '',
        loanPeriodLabel: ''
      }
    },
	onShow() {
		this.tabBerLists = uni.getStorageSync('tabBarList') // 自定义的tabbar赋值
		this.userInfo = uni.getStorageSync('userInfo')
    // getUserInfo().then(res => { //取实时
    //   this.userInfo = res.data
    // })
    this.getWordings()
	},
    onLoad() {
      this.getShopList()
	    this.getBannerList()
    },
	onPullDownRefresh(){
		this.getShopList()
		setTimeout(()=>{
			uni.stopPullDownRefresh()
		},1000)
	},
    methods: {
      // getWordings() {
      //
      //   const maxAmount = uni.getStorageSync('max_amount')
      //   if (maxAmount) {
      //     this.maxAmountLabel = maxAmount
      //   }
      //
      //   const annualInterest = uni.getStorageSync('annual_interest')
      //   if (annualInterest) {
      //     this.annualInterestLabel = annualInterest
      //   }
      //
      //   const loanPeriod = uni.getStorageSync('loan_period')
      //   if (loanPeriod) {
      //     this.loanPeriodLabel = loanPeriod
      //   }
      // },
      getWordings() {
        getFontByKey('wording.param1').then(res => {
          if (res.data) {
            uni.setStorageSync('max_amount', res.data)
            this.maxAmountLabel = res.data
          }
        })

        getFontByKey('wording.param2').then(res => {
          if (res.data) {
            uni.setStorageSync('annual_interest', res.data)
            this.annualInterestLabel = res.data
          }
        })

        getFontByKey('wording.param3').then(res => {
          if (res.data) {
            uni.setStorageSync('loan_period', res.data)
            this.loanPeriodLabel = res.data
          }
        })
      },
		//获取商品
		getShopList(){
			getShop().then(res => {
				this.productList = res.data
			})
		},
		toDeatil(id){
      uni.navigateTo({
        url:`/pages/category/productDetail?id=${id}`
      })
			// if(this.userInfo.name && this.userInfo.age && this.userInfo.censusRegister && this.userInfo.registeredHk){
			// uni.navigateTo({
			// 	url:`/pages/category/productDetail?id=${id}`
			// })}else{
      //   uni.$u.toast('请先完善基本信息！')
      //   setTimeout(()=>{
      //     uni.navigateTo({
      //       url:"/pages/setting/setting"
      //     })
      //   },700)
			// }
		},
		//智能匹配
      toComple() {

        const userInfo = uni.getStorageSync('userInfo')
        //console.log(userInfo)
        if (!userInfo || !userInfo.id) {
          uni.showModal({
            title: '提示',
            content: '该功能需要登录后使用，是否立即登录？',
            success: (res) => {
              if (res.confirm) {
                getUserInfo().then(res => { //取实时
                  this.userInfo = res.data
                  uni.setStorageSync('userInfo',res.data)
                })
              }
            }
          })
          return
        }

        uni.navigateTo({
          url: `/pages/category/testLimit?id=&type=1&tableId=0`
        })

        // if (userInfo.name && userInfo.age && userInfo.censusRegister && userInfo.registeredHk) {
        //   uni.navigateTo({
        //     url: `/pages/category/testLimit?id=&type=1&tableId=0`
        //   })
        // } else {
        //   uni.$u.toast('请先完善基本信息')
        //   setTimeout(() => {
        //     uni.navigateTo({
        //       url: "/pages/setting/setting"
        //     })
        //   }, 1500)
        // }

      },
		//获取banner
		getBannerList(){
			getBanner({bannerType:2}).then(res => {
				res.data.forEach(v => {
					this.bannerList.push(v.bannerImg)
				})
			})
		}
    }
  }
</script>

<style lang="scss" scoped>
.container{
	min-height: 100vh;
	background-color: #f7f7f7;
}
.productList{
	padding: 24rpx;
	padding-bottom: 150rpx;
	.product{
		padding: 20rpx;
		border-radius: 10rpx;
		background-color: #fff;
		margin: 10rpx 0;
		.product-top{
			padding: 20rpx 0;
			border-bottom: 1rpx solid #f7f7f7;
			.product-Pic{
				width: 70rpx;
				height: 70rpx;
				border-radius: 10rpx;
				margin-right: 10rpx;
			}
			.product-tabs{
				height: 40rpx;
				line-height: 40rpx;
				background-color: #EFEFFD;
				color: #323CDD;
				padding: 4rpx 10rpx;
				border-radius: 4rpx;
			}
			.right{
				margin: 0 10rpx;
			}
		}
		.product-mess{
			padding: 20rpx 0;
			.applyBtn{
				width: 200rpx;
				line-height: 70rpx;
				border-radius: 40rpx;
				background-color: #323CDD;
			}
		}
	}
	.mateBtn{
		width: 300rpx;
		line-height: 80rpx;
		border-radius: 40rpx;
		margin: 55rpx auto;
    background: linear-gradient(252deg, #2443ed 0%, #7a7af7 100%);
		position: fixed;
		bottom: 90rpx;
		left: calc(50% - 150rpx);
	}
}

</style>
